<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	
	<body>
		<script src="../js/vue.js"></script>
		<div id="app">
			<h2>{{totalPrice}}</h2>
		</div>
		<script>
			var app = new Vue({
				el: '#app',
				data: {
					books:[
						{id:1,name:"mysql从学习到删库",price:80},
						{id:1,name:"java从学习到跑路",price:80},
						{id:1,name:"linux从学习到卸载",price:80},
						{id:1,name:"js从学习到秃头",price:80},
						],
				},
				computed:{
					totalPrice:function(){
						let result=0;
						for(let i=0;i<this.books.length;i++){
							result+=this.books[i].price
						}
						return result
					}
				},
				methods: {

				}
				
			})
		</script>
	</body>
</html>
